// 联系人右键菜单
import React from 'react';
import {
    FileImageOutlined
} from '@ant-design/icons';
import '../../style.css';

const RightClickMenu = (props: any) =>{
    const { contactsRightClick } = props;
    const test = (e: any) => {
        e.stopPropagation();
    };
    // 单聊
    const renderSingerMenu = () => {
        return <div className='WeChatContactsAvatarTools' onClick={test}>
                <div className='items'>
                    <div>
                        <FileImageOutlined />
                    </div>
                    <div>
                        Mark as unread
                    </div>
                </div>
                <div className='items'>
                    <div>
                        <FileImageOutlined />
                    </div>
                    <div>
                        Mute Notifications
                    </div>
                </div>
                <div className='items'>
                    <div>
                        <FileImageOutlined />
                    </div>
                    <div>
                        Remove
                    </div>
                </div>
                <div className='items'>
                    <div>
                        <FileImageOutlined />
                    </div>
                    <div>
                        Clear Chat History
                    </div>
                </div>
            </div>
    };
    // 群聊 为了扩展
    const renderGroupMenu = () => {
        return <div className='WeChatContactsAvatarTools' onClick={test}>
            <div className='items'>
                <div>
                    <FileImageOutlined />
                </div>
                <div>
                    Mark as unread
                </div>
            </div>
            <div className='items'>
                <div>
                    <FileImageOutlined />
                </div>
                <div>
                    Mute Notifications
                </div>
            </div>
            <div className='items'>
                <div>
                    <FileImageOutlined />
                </div>
                <div>
                    Remove
                </div>
            </div>
            <div className='items'>
                <div>
                    <FileImageOutlined />
                </div>
                <div>
                    Clear Chat History
                </div>
            </div>
            <div className='lastItem'>
                <div>
                    <FileImageOutlined />
                </div>
                <div>
                    Leave Group
                </div>
            </div>
        </div>
    };
    return(
        contactsRightClick.isGroup ?  renderGroupMenu() : renderSingerMenu()
    )
};

export default React.memo(RightClickMenu);